import Taro from '@tarojs/taro';
import { View } from '@tarojs/components';
import { AtModal, AtModalContent, AtModalHeader } from 'taro-ui'
import './index.scss';


class MyModal extends Taro.Component {
    static defaultProps = {
        renderSolt: '',
        title: '温馨提示',
        canceltext: '取消',
        confirmtext: '确认',
        confirm: () => {
        },
        cancel:() =>{

        }
    };
    constructor(props) {
        super(props);
        this.state = {
            isOpen: false
        }
    }
    componentWillMount() {
        console.log(this.props)
    }
    isShow() {
        this.setState({ 
            isOpen: true 
        })
    }
    isHide() {
        this.setState({
            isOpen: false
        })
    }
    render() {
        const { title, confirmtext, canceltext } = this.props;
        const { isOpen } = this.state;
        return (
            <AtModal isOpened={isOpen} >
                <AtModalHeader><View className='ft_600 text-c line-b pt-2-5 pb-2-5'>{title}</View></AtModalHeader>
                <AtModalContent>
                    {this.props.renderSolt}
                    <View className='flex flex-r flex-item-between'>
                        {canceltext ? <View
                          className='pt-1-5 pb-1-5 pl-6-5 pr-6-5 borer-ov bdr_10 fc_65C de-btn'
                          onClick={this.props.cancel.bind(this)}
                        >{canceltext}</View> : null
                        }
                        {confirmtext ?<View
                          className='bg_1FF pt-1-5 pb-1-5 pl-6-5 pr-6-5 bdr_10 fc_FFF de-btn'
                          onClick={this.props.confirm.bind(this)}
                        >{confirmtext}</View> : null
                        }
                    </View>
                </AtModalContent>
            </AtModal>
        );
    }
}

export default MyModal;